import React from "react";
import { connect } from "react-redux";

const mapStateToProps = (state) => {
  return {
    list: state.list,
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    remove(id) {
      dispatch({ type: "remove", id });
    },
  };
};

const List = connect(
  mapStateToProps,
  mapDispatchToProps
)((props) => {
  return (
    <ul>
      {props.list.map((item) => (
        <li key={item.id}>
          {item.name} -{" "}
          <button onClick={() => props.remove(item.id)}>删除</button>
        </li>
      ))}
    </ul>
  );
});

// export default connect(mapStateToProps, mapDispatchToProps)(List);
export default List;
